import { SetupContext, defineComponent, ref, computed, onMounted, nextTick, onUnmounted } from 'vue';
import { ExtendCalendarPropsType, ExtendCalendarProps } from './extend-calendar.props';
import calendarWeek from './components/calendar-week.component';
import calendarDay from './components/calendar-day.component';
import calendarAction from './components/calendar-action.component';
import calendarTask from './components/calendar-task.component';
import './extend-calendar.css';

export default defineComponent({
    name: 'FExtendCalendar',
    props: ExtendCalendarProps,
    emits:['clickItem'],
    setup(props: ExtendCalendarPropsType, context: SetupContext) {
        const renderWeek = calendarWeek(props,context);
        const {renderDay,date,selftDate,visible,switchCalendarDates,dateTask} = calendarDay(props,context);
        const renderAction = calendarAction(props,context,date,selftDate,visible,switchCalendarDates);
        const renderTask = calendarTask(props,context,dateTask);
        return () => {
           return (<div class='f-extend-calendar'>
                {renderAction()}
                {renderWeek()}
                {renderDay()}
                {renderTask()}
           </div>)
        };
    }
});
